<template>
    <div class="gray-body w750" :style="{ '--themescolor': themes.color }">
        <div class="order-detail" style="margin-bottom: 0px" :class="themes.theme">
            <!-- 头部状态 -->
            <div
                class="alert--warning"
                style="padding: 8px 15px; font-size: 12px"
                v-if="(orderDet.status != 1 || orderDet.status != 4) && orderDet.payManner == 10"
            >
                您已选择货到付款， 签收无误后按卖家约定支付货款。
            </div>

            <div class="order-state" v-if="orderDet.status == 1">
                <div class="state-txt">
                    <div class="sta">等待支付</div>
                    <count-down :time="orderDet.canelPayDate" :custom="true" @finish="endcallback">
                        <template v-slot="Timer">
                            <div class="des" style="font-size: 12px">
                                剩余 {{ Timer.times.days }} 天 {{ Timer.times.hours }} 时 {{ Timer.times.minutes }} 分 {{ Timer.times.seconds }} 秒
                                自动取消订单
                            </div>
                        </template>
                    </count-down>
                    <!-- <countdown  :endTime="orderDet.canelPayDate" :source='"orderDetail"' :text="'自动关闭'"  @endcallback="_callback"/> -->
                </div>

                <div class="state-img">
                    <img src="@/assets/images/order-state.png" alt="" />
                </div>
            </div>

            <!-- 待发货 -->
            <div class="order-state" v-if="orderDet.status == 2">
                <div class="state-txt" v-if="orderDet.refundState == 0">
                    <template v-if="orderDet.activeType == 'MERGE_GROUP'">
                        <div class="sta" v-if="orderDet.mergeGroupStatus == 0">已付款,等待成团</div>
                        <div class="sta" v-if="orderDet.mergeGroupStatus == 1">已成团,等待发货</div>

                        <count-down :time="orderDet.canelMergeGroupDate" :custom="true" @finish="endcallback" v-if="orderDet.canelMergeGroupDate">
                            <template v-slot="Timer">
                                <div class="des" style="font-size: 12px; color: #fff">
                                    剩余 {{ Timer.times.days }} 天 {{ Timer.times.hours }} 时 {{ Timer.times.minutes }} 分
                                    {{ Timer.times.seconds }} 秒 之内邀请{{
                                        orderDet.mergerGroupPeopleNum - orderDet.mergerGroupAlreadyAddNum
                                    }}位好友成团
                                </div>
                            </template>
                        </count-down>
                        <!-- <countdown  v-if="orderDet.canelMergeGroupDate == 0" :endTime="orderDet.canelMergeGroupDate" :source='"orderDetail"' :text="`之内邀请${orderDet.mergerGroupAlreadyAddNum - orderDet.mergerGroupPeopleNum}位好友成团`" @endcallback="_callback"/> -->
                    </template>

                    <template v-else>
                        <!-- 配送方式 -->
                        <template v-if="orderDet.deliveryType == 'merchantDelivery'">
                            <div class="sta">等待发货</div>
                            <div class="des">请耐心等待商家发货</div>
                        </template>
                        <template v-else>
                            <div class="sta">商品正在备货中</div>
                            <div class="des">请到指定自提点提取商品</div>
                        </template>
                    </template>
                </div>

                <div class="state-txt" v-if="orderDet.refundState == 1">
                    <div class="sta" v-if="orderDet.mergeGroupStatus == -1 && orderDet.activeType == 'MERGE_GROUP'">拼团失败,退款中</div>
                    <div class="sta" v-else>售后中</div>
                    <div class="des">请耐心等待处理</div>
                </div>

                <div class="state-txt" v-if="orderDet.refundState == 2">
                    <div class="sta" v-if="orderDet.mergeGroupStatus == -1 && orderDet.subType == 'MERGE_GROUP'">拼团失败,退款完成</div>
                    <div class="sta" v-else>退款完成</div>
                    <div class="des">感谢您本次交易，欢迎下次购买</div>
                </div>

                <div class="state-img">
                    <img src="@/assets/images/order-state.png" alt="" />
                </div>
            </div>

            <div class="order-state" v-if="orderDet.status == 3">
                <div class="state-txt">
                    <div class="sta" v-if="orderDet.refundState == 1">售后处理中</div>
                    <div class="sta" v-else-if="orderDet.refundState == 2">售后部分完成</div>
                    <div class="sta" v-else-if="orderDet.refundState == 3">售后完成</div>
                    <div class="sta" v-else>{{ orderDet.deliveryType == 'merchantDelivery' ? '卖家已发货' : '卖家已备货完成' }}</div>

                    <template
                        v-if="
                            (orderDet.confirmReceiptDate != 0 || orderDet.confirmReceiptDate != null) &&
                            orderDet.payManner != 10 &&
                            orderDet.refundState == 0
                        "
                    >
                        <count-down :time="orderDet.confirmReceiptDate" :custom="true" @finish="endcallback">
                            <template v-slot="Timer">
                                <div class="des" style="font-size: 12px; color: #fff">
                                    剩余 {{ Timer.times.days }} 天 {{ Timer.times.hours }} 时 {{ Timer.times.minutes }} 分
                                    {{ Timer.times.seconds }} 秒 自动确认收货
                                </div>
                            </template>
                        </count-down>
                    </template>

                    <template v-else-if="orderDet.refundState !== 0">
                        <div class="des">
                            {{ orderDet.refundState == 3 ? '您的订单已售后成功' : '请耐心等待处理' }}
                        </div>
                    </template>
                    <template v-else>
                        <div class="des">
                            {{ orderDet.payManner != 10 ? '系统默认已收货' : '签收时支付货款' }}
                        </div>
                    </template>
                </div>
                <div class="state-img">
                    <img src="@/assets/images/order-state.png" alt="" />
                </div>
            </div>

            <div class="order-state" v-if="orderDet.status == 4">
                <div class="state-txt">
                    <div class="sta">交易成功</div>
                    <div class="des">感谢您在{{ themes.shopName }}购物，欢迎您再次光临</div>
                </div>
                <div class="state-img">
                    <img src="@/assets/images/order-state.png" alt="" />
                </div>
            </div>

            <div class="order-state" v-if="orderDet.status == 5">
                <div class="state-txt">
                    <div class="sta">{{ orderDet.refundState == 3 ? '退款完成' : '已取消' }}</div>
                    <div class="des">{{ orderDet.refundState == 3 ? '您的订单已退款成功' : '您的订单已取消' }}</div>
                </div>
                <div class="state-img">
                    <img src="@/assets/images/order-state.png" alt="" />
                </div>
            </div>
            <!-- 头部状态end -->

            <div class="nodeInfo">
                <!-- 物流信息 -->
                <div
                    class="order-msg logistics"
                    :class="{ border: !wuliuType }"
                    style="border-radius: 0"
                    v-if="wuliuType || addressDto"
                    @click="checkLogistical(orderDet.subNum, addressDto.mobile)"
                >
                    <div class="user-info" v-if="logisticsArr">
                        <img src="@/assets/images/logistics.png" alt="" />
                        <em class="item1">{{ logisticsArr[0].context }}</em>
                    </div>
                    <div class="address-det" v-if="logisticsArr">{{ logisticsArr[0].ftime }}</div>
                    <i class="arr"><img src="@/assets/images/arrow.png" alt="" /></i>
                </div>

                <!-- 收货地址 -->
                <div class="order-msg" v-if="addressDto" style="margin-bottom: 0">
                    <div class="user-info">
                        <!-- <img :src="require(`@/assets/style-images/sub-local-${themes.theme}.png`)" alt="" /> -->
						<span class="iconfont iconlocation img" style="font-size: 16px;"></span>
                        <em class="item">{{ addressDto.receiver }}</em>
                        <em class="item">{{ addressDto.mobile }}</em>
                    </div>
                    <div class="address-det">{{ addressDto.detailAddress }}</div>
                </div>

                <!-- 自提 -->
                <div class="bg-fff font-14" v-if="orderDet.sinceMention">
                    <div class="text-center my-1" v-if="orderDet.status > 1 && orderDet.status < 5">
                        <div class="font-14 letter-sp5 mb-1 pt-1 font-16 font-weight-500">提货码</div>
                        <div class="mt font-20 font-weight letter-sp10">
                            <span class="border p bg-f8">{{ orderDet.sinceMention.sinceMentionCode }}</span>
                        </div>
                    </div>
                    <div class="p-1">
                        <div class="border-bottom">
                            <div class="d-flex mb-1">
                                <span class="mr-1 text-666" style="width: 75px">提货人:</span>
                                <span class="flex-1">{{ orderDet.sinceMention.userContactName }}</span>
                            </div>
                            <div class="d-flex mb-1">
                                <span class="mr-1 text-666" style="width: 75px">提货手机:</span>
                                <span class="flex-1">{{ orderDet.sinceMention.userContactPhone }}</span>
                            </div>
                        </div>
                        <div class="border-bottom mt-1">
                            <div class="d-flex mb-1">
                                <span class="mr-1 text-666" style="width: 75px">自提点:</span>
                                <span class="flex-1">{{ orderDet.sinceMention.pointName }}</span>
                            </div>
                            <div class="d-flex mb-1" @click.stop="checkLocation(orderDet.sinceMention)">
                                <span class="mr-1 text-666" style="width: 75px">提货地址:</span>
                                <span class="flex-1 d-flex">
									<span>{{ orderDet.sinceMention.sinceMentionDetailAddr }}</span>
									<span class="iconfont iconArrowRight flex-center ml-1" style="font-size: 14px; color: #c0c4d6"></span>
								</span>
                            </div>
                            <div class="d-flex mb-1">
                                <span class="mr-1 text-666" style="width: 75px">营业时间:</span>
                                <div class="flex-1">
                                    <span>{{ orderDet.sinceMention.periodJoin }}</span>
                                    <div class="font-12 text-999 mt">
                                        <span v-for="(time, index) in orderDet.sinceMention.businessHoursList" :key="index" class="mr">
                                            {{ time.begin }}-{{ time.end }}
                                        </span>
                                    </div>
                                </div>
                            </div>
                            <div class="d-flex mb-1">
                                <span class="mr-1 text-666" style="width: 75px">自提点电话:</span>
                                <span class="flex-1">{{ orderDet.sinceMention.sinceMentionPhone }}</span>
                            </div>
                        </div>
                        <div class="mt-1">
                            <div class="d-flex">
                                <span class="mr-1 text-666" style="width: 75px">配送方式:</span>
                                <span class="flex-1">到店自提</span>
                            </div>
                        </div>
                    </div>
                </div>

                <div
                    class="order-address"
                    v-if="orderDet.specialOrderType == 'OVERSEAS_ORDER'"
                    @click="goIdentity"
                    style="padding: 0px 24px 0px 10px"
                >
                    <div class="user-info" style="padding: 12px 10px">
                        <em class="item">身份信息</em>
                        <em class="item">{{ orderDet.overseasName }}</em>
                        {{ orderDet.overseasCartNum }}
                    </div>
                    <i class="arr" style="width: 8px; height: 8px; right: 20px; top: 42%">
                        <img src="@/assets/images/arrow.png" alt="" style="width: 100%" />
                    </i>
                </div>
            </div>

            <!-- 清关状态 -->
            <div class="customs-state" v-if="orderDet.status == 2 && orderDet.overseasCustomsStatus == 'FAIL_CUSTOMS'">
                <span class="state">清关失败，请联系商家</span>
            </div>
            <!-- 清关状态 -->
            <div class="order-list">
                <div class="list-item">
                    <div class="pro-mes" v-for="(item, index) in orderDet.subOrderItemDtos" :key="index" @click="gogoodsDet(item.prodId, item)">
                        <div class="content">
                            <div class="content-box">
                                <div class="pro-img">
                                    <legend-image
                                        :pic="item.pic"
                                        :type="'wh'"
                                        :options="{ w: '160', h: '160' }"
                                        :class="'needsclick'"
                                        :isJD="item.prodSource == 'JD'"
                                    />
                                    <img src="@/assets/images/haitao-small.png" class="haitao" v-if="item.goodsType == 'overseas'" />
									<!-- 如果是赠品则展示 -->
									<span v-if="item.isPresent == true">
										<span class="text" v-if="item.prodSource == 'JD'">京东赠品</span>
										<span class="text" v-else>赠品</span>
									</span>
                                </div>
                                <div class="pro-name">
                                    <div class="pro-cent">
                                        <div class="name">{{ item.prodName }}</div>
                                        <div class="status" v-if="item.shipmentStatus == 2 && orderDet.status == 2">已发货</div>
                                    </div>
                                    <div class="sku">
                                        <span style="margin-right: 10px" v-if="item.attribute">{{ item.attribute }}</span>
                                        <span class="goods-num">数量：{{ item.basketCount }}</span>
                                    </div>

                                    <div class="goods-btn clearfix" v-if="orderDet.status == 1">
                                        <span class="price">
                                            ￥
                                            <em class="now">{{ Money(item.price)[0] }}</em>
                                            .{{ Money(item.price)[1] }}
                                        </span>
                                    </div>

                                    <div class="goods-btn clearfix" v-if="orderDet.status == 2">
                                        <span class="price">
                                            ￥
                                            <em class="now">{{ Money(item.price)[0] }}</em>
                                            .{{ Money(item.price)[1] }}
                                        </span>
                                    </div>

                                    <div class="goods-btn clearfix" v-if="orderDet.status == 3">
                                        <span class="price">
                                            ￥
                                            <em class="now">{{ Money(item.price)[0] }}</em>
                                            .{{ Money(item.price)[1] }}
                                        </span>
                                    </div>

                                    <div class="goods-btn clearfix" v-if="orderDet.status == 4">
                                        <span class="price">
                                            ￥
                                            <em class="now">{{ Money(item.price)[0] }}</em>
                                            .{{ Money(item.price)[1] }}
                                        </span>
                                    </div>

                                    <div class="goods-btn clearfix" v-if="orderDet.status == 5">
                                        <span class="price">
                                            ￥
                                            <em class="now">{{ Money(item.price)[0] }}</em>
                                            .{{ Money(item.price)[1] }}
                                        </span>
                                    </div>
                                </div>
                            </div>

                            <template v-if="orderDet.status == 2">
                                <div class="button-box" v-if="item.isPresent == false">
                                    <span
                                        class="btn"
                                        @click.stop="goAfterSale(item, 0)"
                                        v-if="
                                            item.refundState == 0 &&
                                            !orderDet.freeOrder &&
                                            orderDet.payManner !== 10 &&
                                            orderDet.activeType == 'NORMAL'
                                        "
                                    >
                                        申请售后
                                    </span>
                                    <!-- 拼团单只有一个订单项 -->
                                    <span
                                        class="btn"
                                        @click.stop="goAfterSale(item, 0)"
                                        v-if="orderDet.mergeGroupStatus == 1 && orderDet.activeType == 'MERGE_GROUP'"
                                    >
                                        申请售后
                                    </span>
                                    <span
                                        class="btn cur"
                                        v-if="item.refundState == 10 || item.refundState == 30 || item.refundState == 40"
                                        @click.stop="gobackPach(item.refundId)"
                                    >
                                        售后中
                                    </span>
                                    <span class="btn cur" v-if="item.refundState == -10" @click.stop="gobackPach(item.refundId)">已拒绝</span>
                                    <span class="btn cur" v-if="item.refundState == 20" @click.stop="gobackPach(item.refundId)">待返货</span>
                                    <span class="btn cur" v-if="item.refundState == 50" @click.stop="gobackPach(item.refundId)">待退款</span>
                                    <span class="btn cur" v-if="item.refundState == 60" @click.stop="gobackPach(item.refundId)">待买家收货</span>
                                    <span class="btn cur" v-if="item.refundState == 70" @click.stop="gobackPach(item.refundId)">退款完成</span>
                                </div>
                            </template>

                            <template v-if="orderDet.status == 3">
                                <div class="button-box" v-if="item.isPresent == false">
                                    <span
                                        class="btn"
                                        v-if="item.refundState == 0 && orderDet.payManner != 10 && !orderDet.freeOrder"
                                        @click.stop="goAfterSale(item, 0)"
                                    >
                                        申请售后
                                    </span>
                                    <span
                                        class="btn cur"
                                        v-if="item.refundState == 10 || item.refundState == 30 || item.refundState == 40"
                                        @click.stop="gobackPach(item.refundId)"
                                    >
                                        售后中
                                    </span>
                                    <span class="btn cur" v-if="item.refundState == -10" @click.stop="gobackPach(item.refundId)">已拒绝</span>
                                    <span class="btn cur" v-if="item.refundState == 20" @click.stop="gobackPach(item.refundId)">待返货</span>
                                    <span class="btn cur" v-if="item.refundState == 50" @click.stop="gobackPach(item.refundId)">待退款</span>
                                    <span class="btn cur" v-if="item.refundState == 60" @click.stop="gobackPach(item.refundId)">待买家收货</span>
                                    <span class="btn cur" v-if="item.refundState == 70" @click.stop="gobackPach(item.refundId)">退款完成</span>
                                </div>
                            </template>

                            <template v-if="orderDet.status == 4">
                                <div class="button-box" v-if="item.isPresent == false">
                                    <span class="btn" @click.stop="addCar(item.prodId, item.skuId)">加购物车</span>
                                    <span class="btn" v-if="item.refundState == 0 && !orderDet.freeOrder" @click.stop="goAfterSale(item, 0)">
                                        申请售后
                                    </span>
                                    <span
                                        class="btn cur"
                                        v-if="item.refundState == 10 || item.refundState == 30 || item.refundState == 40"
                                        @click.stop="gobackPach(item.refundId)"
                                    >
                                        售后中
                                    </span>
                                    <span class="btn cur" v-if="item.refundState == -10" @click.stop="gobackPach(item.refundId)">已拒绝</span>
                                    <span class="btn cur" v-if="item.refundState == 20" @click.stop="gobackPach(item.refundId)">待返货</span>
                                    <span class="btn cur" v-if="item.refundState == 50" @click.stop="gobackPach(item.refundId)">待退款</span>
                                    <span class="btn cur" v-if="item.refundState == 60" @click.stop="gobackPach(item.refundId)">待买家收货</span>
                                    <span class="btn cur" v-if="item.refundState == 70" @click.stop="gobackPach(item.refundId)">退款完成</span>
                                    <span
                                        class="btn cur1"
                                        v-if="item.refundState == 0 && !orderDet.freeOrder && item.enableWarrantyCard"
                                        @click.stop="goWarrantyCard(item, orderDet.subNum)"
                                    >
                                        {{ item.alreadyActivated ? '查看质保卡' : '激活质保卡' }}
                                    </span>
                                </div>
                            </template>

                            <template v-if="orderDet.status == 5 ">
                                <div v-if="item.isPresent == false" class="button-box" @click.stop="addCar(item.prodId, item.skuId)">
                                    <span class="btn">加购物车</span>
                                </div>
                            </template>
							
							<template v-if="orderDet.status == 6">
							    <div class="button-box" v-if="item.isPresent == false">
							        <span
							            class="btn"
							            @click.stop="goAfterSale(item, 0)"
							            v-if="
							                item.refundState == 0 &&
							                !orderDet.freeOrder &&
							                orderDet.payManner !== 10 &&
							                orderDet.activeType == 'NORMAL'
							            "
							        >
							            申请售后
							        </span>
							        <!-- 拼团单只有一个订单项 -->
							        <span
							            class="btn"
							            @click.stop="goAfterSale(item, 0)"
							            v-if="orderDet.mergeGroupStatus == 1 && orderDet.activeType == 'MERGE_GROUP'"
							        >
							            申请售后
							        </span>
							        <span
							            class="btn cur"
							            v-if="item.refundState == 10 || item.refundState == 30 || item.refundState == 40"
							            @click.stop="gobackPach(item.refundId)"
							        >
							            售后中
							        </span>
							        <span class="btn cur" v-if="item.refundState == -10" @click.stop="gobackPach(item.refundId)">已拒绝</span>
							        <span class="btn cur" v-if="item.refundState == 20" @click.stop="gobackPach(item.refundId)">待返货</span>
							        <span class="btn cur" v-if="item.refundState == 50" @click.stop="gobackPach(item.refundId)">待退款</span>
							        <span class="btn cur" v-if="item.refundState == 60" @click.stop="gobackPach(item.refundId)">待买家收货</span>
							        <span class="btn cur" v-if="item.refundState == 70" @click.stop="gobackPach(item.refundId)">退款完成</span>
							    </div>
							</template>
                        </div>
                    </div>
                    <!-- 暂时先屏蔽 -->
                    <div class="contact-btn">
                        <span @click="serviceChat" class="btn">联系客服</span>
                    </div>
                </div>
            </div>
            <div class="order-other-msg">
                <div class="item-box">
                    <div class="other-item" v-if="orderDet.outSubNumber">
                        <b class="item-b">外部单号：</b>
                        <span class="item-span">{{ orderDet.outSubNumber }}</span>
                        <span class="item-a" v-clipboard:copy="orderDet.outSubNumber" v-clipboard:success="onCopy" v-clipboard:error="onError">
                            复制
                        </span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">订单编号：</b>
                        <span class="item-span">{{ orderDet.subNum }}</span>
                        <span class="item-a" v-clipboard:copy="orderDet.subNum" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">下单时间：</b>
                        <span class="item-span">{{ orderDet.subDate | dateformat('YYYY-MM-DD HH:mm:ss') }}</span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">买家留言：</b>
                        <span class="item-span">
                            {{
                                orderDet.orderRemark == '' || orderDet.orderRemark == null || orderDet.orderRemark === 'null'
                                    ? '暂无'
                                    : orderDet.orderRemark
                            }}
                        </span>
                    </div>
                </div>
                <div class="item-box" v-if="orderDet.isPayed">
                    <div class="other-item" v-if="orderDet.isPayed && orderDet.payTypeName">
                        <b class="item-b">支付方式：</b>
                        <span class="item-span">{{ orderDet.payTypeName }}</span>
                    </div>

                    <div class="other-item" v-if="deliveryDto != null">
                        <b class="item-b">配送方式：</b>
                        <span class="item-span">普通快递</span>
                    </div>
                </div>
                <!-- 暂时屏蔽 -->
                <!-- <div class="item-box">
                <div v-if="orderDet.invoiceSub != null">
                    <div class="other-item">
                        <b class="item-b">发票类型：</b>
                        <span class="item-span">电子普通发票</span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">发票抬头：</b>
                        <span class="item-span">{{orderDet.invoiceSub.typeId == 1 ? `个人` : `单位`}}</span>
                    </div>
                     <div class="other-item">
                        <b class="item-b">{{orderDet.invoiceSub.typeId == 1 ? '个人姓名' : '单位名称'}}：</b>
                        <span class="item-span">{{orderDet.invoiceSub.invTitle}}</span>
                    </div>
                    <div class="other-item" v-if="orderDet.invoiceSub.typeId == 2 ">
                        <b class="item-b">纳税人编号：</b>
                        <span class="item-span">{{orderDet.invoiceSub.invIdfctMark}}</span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">发票内容：</b>
                        <span class="item-span">明细</span>
                    </div>
                </div>
                <div v-else>
                    <div class="other-item">
                        <b class="item-b">发票类型：</b>
                        <span class="item-span">不开发票</span>
                    </div>
                </div>

            </div> -->
            </div>
            <div class="order-other-msg">
                <div class="item-box">
                    <div class="other-item" v-if="orderDet.total != null">
                        <b class="item-b">商品总额：</b>
                        <span class="item-span price">
                            ￥
                            <em class="now">{{ Money(orderDet.total)[0] }}</em>
                            .{{ Money(orderDet.total)[1] }}
                        </span>
                    </div>
                    <div class="other-item" v-if="orderDet.totalTaxes">
                        <div class="item-b">
                            <b class="text-999" style="font-weight: 400">税费：</b>
                            <span @click="checkDetail" class="iconfont iconquestion ml" style="font-size: 12px"></span>
                        </div>
                        <span class="item-span price">
                            ￥
                            <em class="now">{{ Money(orderDet.totalTaxes)[0] }}</em>
                            .{{ Money(orderDet.totalTaxes)[1] }}
                        </span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">运费：</b>
                        <span class="item-span price">
                            ￥
                            <em class="now">{{ Money(orderDet.freightAmount)[0] }}</em>
                            .{{ Money(orderDet.freightAmount)[1] }}
                        </span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">促销优惠：</b>
                        <span class="item-span price">
                            -￥
                            <em class="now">{{ Money(orderDet.marketingAmount)[0] }}</em>
                            .{{ Money(orderDet.marketingAmount)[1] }}
                        </span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">分享折扣金额：</b>
                        <span class="item-span price">
                            -￥
                            <em class="now">{{ Money(orderDet.shareSalesAmount)[0] }}</em>
                            .{{ Money(orderDet.shareSalesAmount)[1] }}
                        </span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">折扣金额：</b>
                        <span class="item-span price">
                            -￥
                            <em class="now">{{ Money(orderDet.salesAmount)[0] }}</em>
                            .{{ Money(orderDet.salesAmount)[1] }}
                        </span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">优惠券：</b>
                        <span class="item-span price">
                            -￥
                            <em class="now">{{ Money(orderDet.couponOffPrice)[0] }}</em>
                            .{{ Money(orderDet.couponOffPrice)[1] }}
                        </span>
                    </div>
                    <div class="other-item">
                        <b class="item-b">{{ integralName }}抵扣：</b>
                        <span class="item-span price">
                            -￥
                            <em class="now">{{ Money(orderDet.integralDeductAmount)[0] }}</em>
                            .{{ Money(orderDet.integralDeductAmount)[1] }}
                        </span>
                    </div>
                    <div class="other-item">
                        <span class="item-span price price-b">
                            <small class="price-s">实付款：</small>
                            ￥
                            <em class="now">{{ Money(orderDet.actualTotal)[0] }}</em>
                            .{{ Money(orderDet.actualTotal)[1] }}
                        </span>
                    </div>
                </div>
            </div>
        </div>

        <!-- 订单状态判断 -->
        <!-- 待付款 -->
        <div class="order-detail-foot" :class="themes.theme" v-if="orderDet.status == 1">
            <div class="foot-box clearfix">
                <span class="foot-btn" @click="cancelOrder(orderDet.subNum)">取消订单</span>
                <span class="foot-btn cur" @click="payment(orderDet.subNum)">立即付款</span>
            </div>
        </div>
        <!-- 待发货2 待收货3 -->
        <div class="order-detail-foot" :class="themes.theme" v-if="orderDet.status == 2 || orderDet.status == 3">
            <div class="foot-box clearfix">
                <span v-if="orderDet.invoiceId > 0" class="foot-btn" @click="goInvoiceDetail(orderDet.invoiceId)">查看发票</span>
                <template v-if="orderDet.refundState == 0">
                    <span v-if="orderDet.supportInvoice && orderDet.invoiceId === 0" class="foot-btn" @click="goInvoice(orderDet.subNum)">
                        申请发票
                    </span>
                    <span
                        class="foot-btn"
                        @click="goAfterSale(orderDet.subOrderItemDtos, 1)"
                        v-if="
                            (orderDet.activeType == 'MERGE_GROUP' && orderDet.mergeStatus == 1) ||
                            (orderDet.activeType != 'MERGE_GROUP' &&
                                orderDet.payManner != 10 &&
                                !orderDet.hasSingleShipment &&
                                orderDet.subOrderItemDtos.length > 1 &&
                                orderDet.subOrderItemDtos[0].prodSource !== 'JD')
                        "
                    >
                        批量退款
                    </span>
                    <span class="foot-btn" @click="cancelmoneyFor(orderDet.status)" v-if="orderDet.payManner == 10">取消订单</span>
                    <span
                        class="foot-btn"
                        v-if="orderDet.deliveryType != 'sinceMention' && orderDet.status == 3"
                        @click="checkLogistical(orderDet.subNum, addressDto.mobile)"
                    >
                        查看物流
                    </span>
                    <span
                        class="foot-btn cur"
                        v-if="
                            (orderDet.refundState == 0 || orderDet.refundState == 2) &&
                            orderDet.deliveryType != 'sinceMention' &&
                            orderDet.status == 3
                        "
                        @click="confirmGoods(orderDet.subNum)"
                    >
                        确认收货
                    </span>
                    <span
                        class="foot-btn cur text-main"
                        v-if="
                            (orderDet.status == 2 && orderDet.activeType == 'MERGE_GROUP' && orderDet.mergeStatus == 1) ||
                            (orderDet.status == 2 && orderDet.activeType != 'MERGE_GROUP')
                        "
                        @click="remindDelivery(orderDet.subNum)"
                        style="background: #fff"
                    >
                        {{ orderDet.deliveryType == 'sinceMention' ? '提醒备货' : '提醒发货' }}
                    </span>
                    <!-- 提货凭证 -->
                    <span class="foot-btn cur" @click="proofShow = true" v-if="orderDet.deliveryType == 'sinceMention'">提货凭证</span>
                </template>
                <span class="foot-btn cur" v-else-if="orderDet.activeType != 'MERGE_GROUP'" @click="goBuy(orderDet.subNum)">再次购买</span>
                <span v-if="orderDet.activeType == 'MERGE_GROUP'" class="foot-btn cur" @click.stop="gofightgroupDet(orderDet.addNumber)">
                    查看团详情
                </span>
            </div>
        </div>
        <!-- 已完成4 已取消5 -->
        <div class="order-detail-foot" :class="themes.theme" v-if="orderDet.status == 4 || orderDet.status == 5">
            <span class="del-order" @click="deleteOrder(orderDet.subNum, false)">删除订单</span>
            <div class="foot-box clearfix" @click="goBuy(orderDet.subNum)">
                <span v-if="orderDet.supportInvoice && orderDet.invoiceId === 0" class="foot-btn" @click.stop="goInvoice(orderDet.subNum)">
                    申请发票
                </span>
                <span v-if="orderDet.invoiceId > 0" class="foot-btn" @click.stop="goInvoiceDetail(orderDet.invoiceId)">查看发票</span>
                <span v-if="orderDet.activeType == 'MERGE_GROUP'" class="foot-btn cur" @click.stop="gofightgroupDet(orderDet.addNumber)">
                    查看团详情
                </span>
                <span v-if="orderDet.activeType != 'MERGE_GROUP'" class="foot-btn cur">再次购买</span>
                <span class="foot-btn cur" @click.stop="proofShow = true" v-if="orderDet.deliveryType == 'sinceMention' && orderDet.status == 4">
                    提货凭证
                </span>
            </div>
        </div>
        <!-- 订单状态判断end -->

        <customerService :shopContact.sync="shopContact"></customerService>
		
		<div class="go-home flex-center" @click="backHome">
			<svg class="icon svg-icon" style="width: 27px; height: 27px;" aria-hidden="true">
				<use xlink:href="#iconhomePage"></use>
			</svg>
		</div>
        <div style="height: 60px"></div>
        <sinceMentionDialog v-model="proofShow" :subNumber="subNumber" />
    </div>
</template>

<script>
import cash from 'utils/tool'
import { mapState } from 'vuex'
import orderMixin from 'mixin/orderMixin.js'
import countDown from 'components/countdown/count-down'
import legendImage from 'components/legendImage/legendImage'
import customerService from 'components/customerService/customerService'
import {
    myOrderDetail,
    removeOrder,
    orderReceive,
    sendSiteMsg,
    cancleOrder,
    orderLogistics,
    buyAgain,
    afterSaleHasReturnValidPeriod
} from 'api/order'
import { afterSale } from 'api/afterSale'
import { addShopBuy } from 'api/cart'
import { Dialog } from 'vant'
import sinceMentionDialog from '@/components/sinceMentionDialog/sinceMentionDialog'

export default {
    mixins: [orderMixin],
    components: {
        countDown,
        legendImage,
        customerService,
        sinceMentionDialog
    },
    data() {
        return {
            orderDet: '',
            Money: cash, //价格转换
            addressDto: '', //地址
            deliveryDto: '',
            subNumber: '',
            confirmReceiptDate: '',
            payCountdown: '',
            logisticsArr: '', //物流数据
            wuliuType: false,
            timer: null,
            format: '',
            fightCountdown: '',
            subNumber: '',
            shopContact: false,
            proofShow: false // 提货凭证dialog
        }
    },
    mounted() {
        let subNumber = this.$route.query.subNumber
        this.subNumber = subNumber
        this.getOrderDet(subNumber)
        let that = this
    },
    methods: {
        // 去开票详情
        goInvoiceDetail(id) {
            this.$router.push({
                name: 'invoiceDetail',
                query: {
                    id: id //订单号
                }
            })
        },
        // 去开票
        goInvoice(id) {
            this.$router.push({
                name: 'invoice',
                query: {
                    subNumber: id, //订单号
                    type: 1 //0为付款前 1为付款后申请发票
                }
            })
        },
        goback() {
            //注意，这个不能删掉
            this.$router.push('/orderList')
            this.$router.isBack = true
        },
        //获取订单详情数据
        getOrderDet(subNumber) {
            let taht = this
            // this.$toast.loading({
            //     message: '加载中...',
            //     duration: 0
            // });
            myOrderDetail({
                subNumber: subNumber
            })
                .then((res) => {
                    this.$toast.clear()
                    if (res.status == 1) {
                        if (res.result && res.result.splited) {
                            this.$router.replace('/orderList')
                        }
                        this.orderDet = res.result
                        this.addressDto = res.result.userAddress
                        this.deliveryDto = res.result.dvyName

                        //状态等于3 - 才有物流信息
                        if (res.result.status == 3 || res.result.status == 4 || (res.result.status == 2 && res.result.hasSingleShipment)) {
                            if (res.result.userAddress) {
                                return orderLogistics({
                                    subNumber: res.result.subNum,
                                    reciverMobile: res.result.userAddress.mobile
                                })
                            }
                        }
                    } else {
                        this.$toast(res.msg)
                    }
                })
                .then((res) => {
                    if (!res) {
                        return
                    }

                    if (!res.result) {
                        return
                    }

                    if (!res && res.status != 1 && !res.result && !res.result[0].data) {
                        this.wuliuType = false
                        return
                    }

                    if (res.result[0].state == -1) {
                        this.wuliuType = true
                        this.logisticsArr = [
                            {
                                context: '暂无物流信息',
                                ftime: this.$dateformat(new Date().getTime(), 'YYYY-MM-DD HH:mm:ss')
                            }
                        ]

                        return
                    }

                    //物流格式化
                    this.logisticsArr = JSON.parse(res.result[0].data)
                    this.wuliuType = true
                })
                .finally(() => {
                    this.$toast.clear()
                })
        },
        refreshPage() {
            this.getOrderDet(this.$route.query.subNumber)
        },
        //时间到了
        endcallback() {
            this.refreshPage()
        },
        _callback() {
            // this.confirmReceiptDate = '系统默认已收货'
        },
        onCopy(e) {
            this.$toast.success({
                message: '内容已复制',
                duration: 1000
            })
        },
        onError() {
            this.$toast.fail({
                message: '内容复制失败',
                duration: 1000
            })
        },
        targht() {},
        //去售后
        async goAfterSale(order, type) {
            // 如果订单已经完成，则判断订单是否已过售后期
            if (this.orderDet.status == 4) {
                let result = await afterSaleHasReturnValidPeriod({
                    orderId: this.orderDet.subId
                })
                    .then((res) => {
                        if (!res.success) {
                            this.$toast('您的订单售后期已过，如有疑问，请联系客服。')
                            return false
                        }
                        return true
                    })
                    .catch((err) => {
                    })

                if (!result) return
            }

            let id = ''
            let isMult = false
            // 如果type==0则为单个退货 否则为批量
            if (type == 0) {
                //单个取订单项id
                id = order.subItemId
            } else {
                //多选取订单ID 是否多选为true
                isMult = true
                id = this.orderDet.subId
            }

            afterSale.getSelectService({ selectId: id, type: type }).then((res) => {
                if (res.status !== 1) {
                    this.$toast({
                        message: res.msg,
                        duration: 1500
                    })
                    return
                }
                // 京东商品
                if (type == 0 && order.prodSource == 'JD') {
                    // 京东订单还未完成
                    if (res.result.afterSaleService[0].serviceType == 1) {
                        Dialog.confirm({
                            title: '温馨提示',
                            message:
                                '您好，未完成的订单暂不支持在线申请，请联系京东客户热线<a id="phoneing" class="text-danger" href="tel:4006069068">4006069068</a>进行申请。',
                            confirmButtonText: '拨打号码',
                            cancelButtonText: '确认',
                            allowHtml: true,
                            messageAlign: 'left'
                        })
                            .then(() => {
                                // 拨打电话
                                let a = document.querySelector('#phoneing')
                                a.click()
                            })
                            .catch(() => {
                                // on cancel
                            })
                    } else {
                        //京东订单完成 进入售后详情
                        this.$router.push({
                            path: '/applyReturn',
                            query: {
                                orderId: res.result.orderId,
                                orderItemId: res.result.orderItemId,
                                serviceType: res.result.afterSaleService[0].serviceType
                            }
                        })
                    }
                } else {
                    // 自营商品
                    if (res.result.afterSaleService.length > 1) {
                        //如果售后服务类型有两种 则进入选择售后服务页面
                        let afterData = {}
                        afterData.orderInfo = order
                        afterData.serviceType = res.result.afterSaleService
                        afterData = JSON.stringify(afterData)
                        sessionStorage.setItem('afterData', afterData)
                        this.$router.push({
                            path: '/checkStatus',
                            query: {
                                orderId: res.result.orderId,
                                orderItemId: res.result.orderItemId,
                                isMult: isMult
                            }
                        })
                    } else {
                        if (isMult) {
                            //如果是批量退款进入选择商品页面
                            this.$router.push({
                                path: '/checkGoods',
                                query: {
                                    orderId: res.result.orderId,
                                    serviceType: res.result.afterSaleService[0].serviceType
                                }
                            })
                        } else {
                            //直接进入售后详情
                            this.$router.push({
                                path: '/applyReturn',
                                query: {
                                    orderId: res.result.orderId,
                                    orderItemId: res.result.orderItemId,
                                    serviceType: res.result.afterSaleService[0].serviceType
                                }
                            })
                        }
                    }
                }
            })
        },
        //去商品详情
        gogoodsDet(goodsInfoId, item) {
			// 京东赠品不跳转
			if(item.isPresent && item.prodSource == 'JD') {
				return this.$toast({
				    message: '该商品是京东赠品',
				    duration: 1500
				})
			}
            this.$router.push({
                path: `/goodsDetail`,
                query: {
                    goodsInfoId: goodsInfoId
                }
            })
        },
        //商品加到购物车
        addCar(prodId, skuId) {
            this.$utils.uDebounce(() => {
				let pamars = {
				    count: 1,
				    distUserName: '',
				    prodId: prodId,
				    skuId: skuId
				}
				addShopBuy(pamars).then((res) => {
				    if (res.status == 1) {
				        this.$toast({
				            message: '添加购物车成功',
				            duration: 1500
				        })
				    } else {
				        this.$toast({
				            message: res.msg,
				            duration: 1500
				        })
				    }
				})
			})
        },
        //去店铺
        goShopIndex(shopId) {
            this.$router.push({
                path: `/shopIndex`,
                query: {
                    shopId: shopId
                }
            })
        },
        //去售后列表
        gobackPach(refundId) {
            this.$router.replace({
                path: `/afterSaleDetail`,
                query: {
                    refundId: refundId
                }
            })
        },
		backHome() {
			this.$router.replace({
			    path: `/index`,
			})
		},
        //去客服
        serviceChat() {
            this.shopContact = true
        },
        goIdentity() {
            this.$router.push({
                path: `/identity`,
                query: {
                    source: 'look',
                    identityPicOpen: 0,
                    subId: this.orderDet.subId
                }
            })
        },

        //质保卡
        goWarrantyCard(item, subNum) {
            let that = this
            let str = JSON.stringify(item)
            this.$router.push({
                path: `/warrantyCard`,
                query: {
                    contant: str,
                    subNum
                }
            })
        },

        // 查看税费说明
        checkDetail() {
            this.$dialog.alert({
                title: '税费说明',
                message: '税费已包含在商品价格内，付款时不额外增加费用',
                confirmButtonText: '我知道了'
            })
        },
		// 查看item的地图位置
		checkLocation(sinceMention) {
		    this.$router.push({ name: 'mapPoint', query: { lng: sinceMention.longitude, lat: sinceMention.latitude, title: sinceMention.pointName } })
		},
    },

    computed: {
        ...mapState(['themes']),
        ...mapState(['integralName'])
    }
}
</script>

<style src="../../../assets/css/style/my-style.css" scoped></style>
<style src="../../../assets/css/order.css" scoped></style>
<style scoped>
.order-list .list-item .pro-mes .pro-img {
    position: relative;
}
.order-list .list-item .pro-mes .pro-img .text {
    position: absolute;
    width: 100%;
    bottom: 0;
    color: #fff;
    background: rgba(0, 0, 0, 0.5);
    text-align: center;
    font-size: 12px;
    left: 0;
}
.order-list .list-item .pro-mes .pro-img .haitao {
    position: absolute;
    top: 0;
    left: 0px;
    width: 30px !important;
    height: 30px !important;
}

.order-detail .order-list .list-item .pro-mes .pro-name .pro-cent {
    display: flex;
    align-items: center;
}
.order-detail .order-list .list-item .pro-mes .pro-name .pro-cent .status {
    margin-left: auto;
    color: #faab0c;
}
input[disabled] {
    background-color: #fff;
}
</style>
